<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<meta name="Keywords" content="bilingual menu,中英文双语菜单" /> 
<meta http-equiv="Description" content="完全用CSS实现的中英文双语导航菜单" /> 
<meta content="all" name="robots" /> 
<meta name="author" content="forestgan" /> 
<meta name="copyright" content="http://www.forest53.com" /> 
<title>完全用CSS实现的中英文双语导航菜单</title> 
<style type="text/css"> 
a{ 
color: #FFFF99; 
text-decoration: none; 
} 
a:hover{ 
color: #FFFFFF; 
text-decoration: underline; 
} 
#nav{ 
padding: 10px 10px 0; 
font-size: 12px; 
font-weight: bold; 
margin: 1em 0 0; 
list-style:none; 
} 
#nav li{ 
float: left; 
margin-right: 1px; 
} 
.bi{ 
position: relative; 
z-index: 0; 
} 
.bi:hover{ 
z-index: 99; 
} 
.bi:hover span{ 
visibility: visible; 
top: 0; 
left: 0; 
cursor: pointer; 
} 
.bi span{ 
position: absolute; 
left: -999em; 
visibility: hidden; 
} 
#nav li a,.bi:hover span{ 
line-height: 20px; 
text-decoration: none; 
background: #DDDDDD; 
color: #666666; 
display: block; 
width: 80px; 
text-align: center; 
} 
#nav li a:hover,.bi:hover span{ 
color: #FFFFFF; 
background: #DC4E1B; 
} 
.bi:hover span{ 
padding-top: 2px; 
} 
#navbar{ 
background: #DC4E1B; 
height: 8px; 
overflow: hidden; 
clear: both; 
} 
</style> 
<link href="../css/main.css" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
<div id="top"> 
<ul id="nav"> 
<li><a class="bi" href="Http://www.junstudio.org/">Home<span>首　页</span></a></li> 
<li><a class="bi" href="Http://www.junstudio.org/blog">Blog<span>日志</span></a></li> 
<li><a class="bi" href="Http://www.junstudio.org/guestbook">guestbook<span>留言本</span></a></li> 
<li><a class="bi" href="Http://www.pickbar.com/">Pickbar<span>精品吧</span></a></li> 
<li><a class="bi" href="Http://www.fansir.com/">fansir<span>樊SIR</span></a></li> 
</ul> 
<div id="navbar"></div> 
</body> 
</html>

